<div class="section" id="index-banner">
  <div class="container">
    <div class="row" style="margin-bottom: 0;">
      <div class="col s12 m8 offset-m1 xl7 offset-xl1 center-on-small-only">
        <h1 class="header">Themes</h1>
        <h4 class ="light">Now Updated to Materialize 1.0.0</h4>
      </div>
      <div class="col s12 m3 xl3 offset-xl1">
        <div class="buysellads-header center-on-small-only">
          <!-- CarbonAds Zone Code -->
          <script async type="text/javascript" src="//cdn.carbonads.com/carbon.js?serve=CKYIK27J&placement=materializecss" id="_carbonads_js"></script>
        </div>
      </div>
    </div>
  </div>
</div>

<div class="container">
  <div class="bundle-image">
    <a href="https://materialize-themes.myshopify.com/cart/16686185447513:1?channel=buy_button" target="_blank">
      <img src="https://i.postimg.cc/C1Vs4n0V/bundle.png" alt="Themes Bundle">
    </a>
  </div>
  <div class="row">
    <div class="col s12 m10 offset-m1">

      <div class="row themes-section">
        <div class="col s12 m4">
          <h4>Admin<span class="new badge modal-trigger" data-target="admin-changelog" data-badge-caption="v1.0.2"></span></h4>
          <p class="caption" style="margin-bottom: 0;">Admin is a great template for your app's dashboards, analytics and data visualizations. It comes with custom styles for many plugins like Chart.js, jqvmap, FullCalendar, and DataTables.</p>
          <p style="margin-bottom: 0;"><b>Note: This is a static HTML template</b></p>
<div id='product-component-7a018f7346b'></div>
<script type="text/javascript">
/*<![CDATA[*/

(function () {
  var scriptURL = 'https://sdks.shopifycdn.com/buy-button/latest/buy-button-storefront.min.js';
  if (window.ShopifyBuy) {
    if (window.ShopifyBuy.UI) {
      ShopifyBuyInit();
    } else {
      loadScript();
    }
  } else {
    loadScript();
  }

  function loadScript() {
    var script = document.createElement('script');
    script.async = true;
    script.src = scriptURL;
    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(script);
    script.onload = ShopifyBuyInit;
  }

  function ShopifyBuyInit() {
    var client = ShopifyBuy.buildClient({
      domain: 'materialize-themes.myshopify.com',
      apiKey: '2d9a0b3001fe4fcbe3ba50c42a7df88e',
      appId: '6',
    });

    ShopifyBuy.UI.onReady(client).then(function (ui) {
      ui.createComponent('product', {
        id: [787538149465],
        node: document.getElementById('product-component-7a018f7346b'),
        moneyFormat: '%24%7B%7Bamount%7D%7D',
        options: {
  "product": {
    "buttonDestination": "checkout",
    "variantId": "all",
    "width": "240px",
    "contents": {
      "img": false,
      "imgWithCarousel": false,
      "title": false,
      "variantTitle": false,
      "price": false,
      "description": false,
      "buttonWithQuantity": false,
      "quantity": false
    },
    "text": {
      "button": "BUY $24"
    },
    "styles": {
      "product": {
        "text-align": "left",
        "@media (min-width: 601px)": {
          "max-width": "100%",
          "margin-left": "0",
          "margin-bottom": "50px"
        }
      },
      "button": {
        "padding-left": "20px",
        "padding-right": "20px",
        "border-radius": "2px"
      },
      "title": {
        "font-size": "26px"
      },
      "price": {
        "font-size": "18px"
      },
      "compareAt": {
        "font-size": "15px"
      }
    }
  },
  "cart": {
    "contents": {
      "button": true
    },
    "styles": {
      "button": {
        "border-radius": "2px"
      },
      "footer": {
        "background-color": "#ffffff"
      }
    }
  },
  "modalProduct": {
    "contents": {
      "img": false,
      "imgWithCarousel": true,
      "variantTitle": false,
      "buttonWithQuantity": true,
      "button": false,
      "quantity": false
    },
    "styles": {
      "product": {
        "@media (min-width: 601px)": {
          "max-width": "100%",
          "margin-left": "0px",
          "margin-bottom": "0px"
        }
      },
      "button": {
        "padding-left": "20px",
        "padding-right": "20px",
        "border-radius": "2px"
      }
    }
  },
  "productSet": {
    "styles": {
      "products": {
        "@media (min-width: 601px)": {
          "margin-left": "-20px"
        }
      }
    }
  }
}
      });
    });
  }
})();
/*]]>*/
</script>
        <a class="shopify-btn" target="_blank" href="https://themes.materializecss.com/pages/admin-dashboard.html">DEMO</a>
        </div>
        <div class="col s12 m7 offset-m1">
          <img class="theme-preview" src="https://s15.postimg.cc/j1lqkbmjv/materialize.png" alt="Admin Theme">
        </div>

      </div>


      <div class="row themes-section right-aligned">
        <div class="col s12 m4 offset-m1">
          <h4>Startup<span class="new badge modal-trigger" data-target="startup-changelog" data-badge-caption="v1.0.5"></span></h4>
          <p class="caption" style="margin-bottom: 0;">Startup is a perfect theme for showcasing your new app, company or project. With the help of GSAP and ScrollMagic, create unique scrolling experiences that will keep users engaged.</p>
          <p style="margin-bottom: 0;"><b>Note: This is a static HTML template</b></p>
          <div id='product-component-7b7b0511630'></div>
    <script type="text/javascript">
    /*<![CDATA[*/

    (function () {
      var scriptURL = 'https://sdks.shopifycdn.com/buy-button/latest/buy-button-storefront.min.js';
      if (window.ShopifyBuy) {
        if (window.ShopifyBuy.UI) {
          ShopifyBuyInit();
        } else {
          loadScript();
        }
      } else {
        loadScript();
      }

      function loadScript() {
        var script = document.createElement('script');
        script.async = true;
        script.src = scriptURL;
        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(script);
        script.onload = ShopifyBuyInit;
      }

      function ShopifyBuyInit() {
        var client = ShopifyBuy.buildClient({
          domain: 'materialize-themes.myshopify.com',
          apiKey: '2d9a0b3001fe4fcbe3ba50c42a7df88e',
          appId: '6',
        });

        ShopifyBuy.UI.onReady(client).then(function (ui) {
          ui.createComponent('product', {
            id: [9462627457],
            node: document.getElementById('product-component-7b7b0511630'),
            moneyFormat: '%24%7B%7Bamount%7D%7D',
            options: {
      "product": {
        "buttonDestination": "checkout",
        "variantId": "all",
        "width": "240px",
        "contents": {
          "img": false,
          "imgWithCarousel": false,
          "title": false,
          "variantTitle": false,
          "price": false,
          "description": false,
          "buttonWithQuantity": false,
          "quantity": false
        },
        "text": {
          "button": "BUY $29"
        },
        "styles": {
          "product": {
            "text-align": "left",
            "@media (min-width: 601px)": {
              "max-width": "100%",
              "margin-left": "0",
              "margin-bottom": "50px"
            }
          },
          "button": {
            "padding-left": "20px",
            "padding-right": "20px",
            "border-radius": "2px"
          },
          "title": {
            "font-size": "26px"
          },
          "price": {
            "font-size": "18px"
          },
          "compareAt": {
            "font-size": "15px"
          }
        }
      },
      "cart": {
        "contents": {
          "button": true
        },
        "styles": {
          "button": {
            "border-radius": "2px"
          },
          "footer": {
            "background-color": "#ffffff"
          }
        }
      },
      "modalProduct": {
        "contents": {
          "img": false,
          "imgWithCarousel": true,
          "variantTitle": false,
          "buttonWithQuantity": true,
          "button": false,
          "quantity": false
        },
        "styles": {
          "product": {
            "@media (min-width: 601px)": {
              "max-width": "100%",
              "margin-left": "0px",
              "margin-bottom": "0px"
            }
          },
          "button": {
            "padding-left": "20px",
            "padding-right": "20px",
            "border-radius": "2px"
          }
        }
      },
      "productSet": {
        "styles": {
          "products": {
            "@media (min-width: 601px)": {
              "margin-left": "-20px"
            }
          }
        }
      }
    }
          });
        });
      }
    })();
    /*]]>*/
    </script>
        <a class="shopify-btn" target="_blank" href="https://themes.materializecss.com/pages/startup-horizontal-half.html">DEMO</a>
        </div>
        <div class="col s12 m7">
          <img class="theme-preview" src="https://s14.postimg.cc/sai9xfjrl/materialize.png" alt="Startup Theme">
        </div>

      </div>

      <div class="row themes-section">
        <div class="col s12 m4">
          <h4>Gallery<span class="new badge modal-trigger" data-target="gallery-changelog" data-badge-caption="v1.0.3"></span></h4>
          <p class="caption" style="margin-bottom: 0;">This theme is perfect for Portfolio, Blogs, and Stores with its Google Play Store inspired content transition. This theme is in active development and will have more features and styles added to it in the future.</p>
          <p style="margin-bottom: 0;"><b>Note: This is a static HTML template</b></p>
          <div id='product-component-f979385da90'></div>
    <script type="text/javascript">
    /*<![CDATA[*/

    (function () {
      var scriptURL = 'https://sdks.shopifycdn.com/buy-button/latest/buy-button-storefront.min.js';
      if (window.ShopifyBuy) {
        if (window.ShopifyBuy.UI) {
          ShopifyBuyInit();
        } else {
          loadScript();
        }
      } else {
        loadScript();
      }

      function loadScript() {
        var script = document.createElement('script');
        script.async = true;
        script.src = scriptURL;
        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(script);
        script.onload = ShopifyBuyInit;
      }

      function ShopifyBuyInit() {
        var client = ShopifyBuy.buildClient({
          domain: 'materialize-themes.myshopify.com',
          apiKey: '2d9a0b3001fe4fcbe3ba50c42a7df88e',
          appId: '6',
        });

        ShopifyBuy.UI.onReady(client).then(function (ui) {
          ui.createComponent('product', {
            id: [8831109057],
            node: document.getElementById('product-component-f979385da90'),
            moneyFormat: '%24%7B%7Bamount%7D%7D',
            options: {
      "product": {
        "buttonDestination": "checkout",
        "variantId": "all",
        "width": "240px",
        "contents": {
          "img": false,
          "title": false,
          "variantTitle": false,
          "price": false,
          "description": false,
          "buttonWithQuantity": false,
          "quantity": false
        },
        "text": {
          "button": "BUY $19"
        },
        "styles": {
          "product": {
            "text-align": "left",
            "@media (min-width: 601px)": {
              "max-width": "100%",
              "margin-left": "0",
              "margin-bottom": "50px"
            }
          },
          "button": {
            "padding-left": "20px",
            "padding-right": "20px",
            "border-radius": "2px"
          },
          "title": {
            "font-size": "26px"
          },
          "price": {
            "font-size": "18px"
          },
          "compareAt": {
            "font-size": "15px"
          }
        }
      },
      "cart": {
        "contents": {
          "button": true
        },
        "styles": {
          "button": {
            "border-radius": "2px"
          },
          "footer": {
            "background-color": "#ffffff"
          }
        }
      },
      "modalProduct": {
        "contents": {
          "variantTitle": false,
          "buttonWithQuantity": true,
          "button": false,
          "quantity": false
        },
        "styles": {
          "product": {
            "@media (min-width: 601px)": {
              "max-width": "100%",
              "margin-left": "0px",
              "margin-bottom": "0px"
            }
          },
          "button": {
            "padding-left": "20px",
            "padding-right": "20px",
            "border-radius": "2px"
          }
        }
      },
      "productSet": {
        "styles": {
          "products": {
            "@media (min-width: 601px)": {
              "margin-left": "-20px"
            }
          }
        }
      }
    }
          });
        });
      }
    })();
    /*]]>*/
    </script>
        <a class="shopify-btn" target="_blank" href="https://themes.materializecss.com/pages/demo">DEMO</a>
        </div>
        <div class="col s12 m7 offset-m1">
          <img class="theme-preview" src="https://s23.postimg.cc/9g7ajckrf/thunder.png" alt="Gallery Theme">
        </div>

      </div>
      <div class="row themes-section right-aligned">
        <div class="col s12 m4 offset-m1">
          <h4>Gallery Shopify Theme<span class="new badge modal-trigger" data-target="gallery-shopify-changelog" data-badge-caption="v1.0.1"></h4>
          <p class="caption" style="margin-bottom: 0;">Make your products pop with this Shopify Theme and its Google Play Store inspired content transition. Have a more seamless store experience with this powerful ecommerce platform. This theme is in active development and will be maintained.</p>
          <p style="margin-bottom: 0;"><b>Note: This is a theme made for the Shopify Ecommerce Platform</b></p>

    <div id='product-component-8655a280051'></div>
    <script type="text/javascript">
    /*<![CDATA[*/

    (function () {
      var scriptURL = 'https://sdks.shopifycdn.com/buy-button/latest/buy-button-storefront.min.js';
      if (window.ShopifyBuy) {
        if (window.ShopifyBuy.UI) {
          ShopifyBuyInit();
        } else {
          loadScript();
        }
      } else {
        loadScript();
      }

      function loadScript() {
        var script = document.createElement('script');
        script.async = true;
        script.src = scriptURL;
        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(script);
        script.onload = ShopifyBuyInit;
      }

      function ShopifyBuyInit() {
        var client = ShopifyBuy.buildClient({
          domain: 'materialize-themes.myshopify.com',
          apiKey: '2d9a0b3001fe4fcbe3ba50c42a7df88e',
          appId: '6',
        });

        ShopifyBuy.UI.onReady(client).then(function (ui) {
          ui.createComponent('product', {
            id: [136059551773],
            node: document.getElementById('product-component-8655a280051'),
            moneyFormat: '%24%7B%7Bamount%7D%7D',
            options: {
      "product": {
        "buttonDestination": "checkout",
        "variantId": "all",
        "width": "240px",
        "contents": {
          "img": false,
          "imgWithCarousel": false,
          "title": false,
          "variantTitle": false,
          "price": false,
          "description": false,
          "buttonWithQuantity": false,
          "quantity": false
        },
        "text": {
          "button": "BUY $49"
        },
        "styles": {
          "product": {
            "text-align": "left",
            "@media (min-width: 601px)": {
              "max-width": "100%",
              "margin-left": "0",
              "margin-bottom": "50px"
            }
          },
          "button": {
            "padding-left": "20px",
            "padding-right": "20px",
            "border-radius": "2px"
          },
          "title": {
            "font-size": "26px"
          },
          "price": {
            "font-size": "18px"
          },
          "compareAt": {
            "font-size": "15px"
          }
        }
      },
      "cart": {
        "contents": {
          "button": true
        },
        "styles": {
          "button": {
            "border-radius": "2px"
          },
          "footer": {
            "background-color": "#ffffff"
          }
        }
      },
      "modalProduct": {
        "contents": {
          "img": false,
          "imgWithCarousel": true,
          "variantTitle": false,
          "buttonWithQuantity": true,
          "button": false,
          "quantity": false
        },
        "styles": {
          "product": {
            "@media (min-width: 601px)": {
              "max-width": "100%",
              "margin-left": "0px",
              "margin-bottom": "0px"
            }
          },
          "button": {
            "padding-left": "20px",
            "padding-right": "20px",
            "border-radius": "2px"
          }
        }
      },
      "productSet": {
        "styles": {
          "products": {
            "@media (min-width: 601px)": {
              "margin-left": "-20px"
            }
          }
        }
      }
    }
          });
        });
      }
    })();
    /*]]>*/
    </script>

        <a class="shopify-btn" target="_blank" href="https://materialize-shopify-themes.myshopify.com/">DEMO</a>
        </div>
        <div class="col s12 m7 offset-m1">
          <img class="theme-preview" src="https://s23.postimg.cc/9g7ajckrf/thunder.png" alt="">
        </div>

      </div>
    </div>

  </div>
</div> <!-- End Container -->

<div class="themes-banner">
  <div class="container">
    <div class="row">
      <div class="col s12 m10 offset-m1">
        <p>All themes come with active support. Send your questions and concerns to <a href="mailto:materializethemes@gmail.com?Subject=Theme%20support" target="_top">MaterializeThemes</a></p>
        <p>All themes are under the Personal Use License meaning you can use and modify these themes for personal and client projects. You cannot redistribute or resell these themes in any way.</p>
      </div>
    </div>
  </div>
</div>

<!-- Changelog modals -->
<div id="admin-changelog" class="modal">
  <div class="modal-content">
    <h4>Admin Changelog</h4>
    <p>
      <b>v1.0.2 (October 18th, 2018)</b><br>
- Migrated to Materialize v1.0.0<br>
- Fixed missing element Chart.js errors
    </p>
    <p>
      <b>v1.0.1 (June 20th, 2018)</b><br>
- Fixed some javascript file paths
    </p>
  </div>
  <div class="modal-footer">
    <a href="#!" class="modal-close waves-effect waves-green btn-flat">close</a>
  </div>
</div>

<div id="startup-changelog" class="modal">
  <div class="modal-content">
    <h4>Startup Changelog</h4>

    <p>
      <b>v1.0.5 (October 18th, 2018)</b><br>
- Migrated to Materialize v1.0.0<br>
- Added standalone sass files
    </p>

    <p>
      <b>v1.0.4 (November 14th, 2017)</b><br>
- Fixed read more scrolling browser compatibility<br>
- Fixed background layer z-index on Circle Reveal Intro
    </p>

    <p>
      <b>v1.0.3 (July 16th, 2017)</b><br>
- Many responsiveness fixes across all the pages<br>
- Added support for full height shuffle under transition
    </p>

    <p>
      <b>v1.0.2 (June 4th, 2017)</b><br>
- Added standalone css version
    </p>

    <p>
      <b>v1.0.1 (May 24rd, 2017)</b><br>
- Fixed responsiveness bug
    </p>
  </div>
  <div class="modal-footer">
    <a href="#!" class="modal-close waves-effect waves-green btn-flat">close</a>
  </div>
</div>

<div id="gallery-changelog" class="modal">
  <div class="modal-content">
    <h4>Gallery Changelog</h4>

    <p>
      <b>v1.0.3 (October 22nd, 2018)</b><br>
- Migrated to Materialize v1.0.0<br>
- Back button handling for dynamic routing<br>
- Fixed fillscreen dynamic routing image load bug<br>
- Added standalone Gallery sass support
    </p>

    <p>
      <b>v1.0.2 (May 29th, 2017)</b><br>
- Added support for data attributes that can override options<br>
- Added stop propagation data attribute
    </p>

    <p>
      <b>v1.0.1 (March 23rd, 2017)</b><br>
- Added Dark theme page with separate CSS<br>
- You can now have a galleryExpand without a gallery header
    </p>
  </div>
  <div class="modal-footer">
    <a href="#!" class="modal-close waves-effect waves-green btn-flat">close</a>
  </div>
</div>

<div id="gallery-shopify-changelog" class="modal">
  <div class="modal-content">
    <h4>Gallery Shopify Changelog</h4>
    <p>
      <b>v1.0.1 (Jan 4th, 2018)</b><br>
- GalleryExpand<br>
&nbsp;&nbsp;- Fixed bug where changing hash would cause modal to close<br>

- Product<br>
&nbsp;&nbsp;- Fixed bugs where pagination would cause products to be unloaded<br>
&nbsp;&nbsp;- Product now registers changes for variants<br>
    </p>
  </div>
  <div class="modal-footer">
    <a href="#!" class="modal-close waves-effect waves-green btn-flat">close</a>
  </div>
</div>